<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.yuhang.entity.HyAdmin" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>
        修改个人信息
    </title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="css/main.css" media="all">
    <style>
        .imgs{display: none;}
        input[type="file"]{
            width: 50px;
            height:50px;
            border-radius: 100%;
            opacity:0;
            cursor:pointer;
            border: 1px solid red;
            position: absolute;
        }
    </style>

</head>
<body>

<div class="x-body">
    <form class="layui-form layui-form-pane" id="add">

        <input id="id" name="id" value="${sessionScope.hyAdmin.id}" type="hidden">

        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class='x-red'>*</span>用户名
            </label>
            <div class="layui-input-block">
                <input type="text" name="username" lay-verify="required" autocomplete="off" placeholder="空制在80个汉字，160个字符以内"
                       class="layui-input" value=${sessionScope.hyAdmin.username}>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">头像</label>
            <div class="layui-input-block">
                <button type="button" class="layui-btn" id="uploadFile2">
                    <i class="layui-icon">&#xe67c;</i>上传图片
                </button>
            </div>
        </div>
        <input type="hidden" name="photo" id="ImageUpdate" value="${sessionScope.hyAdmin.photo}"/>
        <div class="layui-upload-list">
            　<img class="layui-upload-img" width="200px" height="100px"  src="${sessionScope.hyAdmin.photo}" id="preShow2"/>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class='x-red'>*</span>电话号码
            </label>
            <div class="layui-input-block">
                <input type="text" name="telephone" lay-verify="required|phone" autocomplete="off" placeholder=""
                       class="layui-input" value=${sessionScope.hyAdmin.telephone}>
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class='x-red'>*</span>密码
            </label>
            <div class="layui-input-block">
                <input type="password" name="password" lay-verify="required" autocomplete="off" placeholder=""
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class='x-red'>*</span>新密码
            </label>
            <div class="layui-input-block">
                <input type="password" name="newpassword" autocomplete="off" placeholder="新密码为空则不修改"
                       class="layui-input">
            </div>
        </div>

        <div class="layui-form-item"  align="center">
            <button class="layui-btn" lay-submit lay-filter="updateUser">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </form>
</div>
<script type="text/javascript" src="layui/layui.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<link rel="stylesheet" href="layui/css/layui.css" type="text/css">

<script type="text/javascript">
    $(window).on('load',function() {
        let item = localStorage.getItem("code");
        if (item != 0) {
            window.location.href = "/login.jsp"
        }
    });
    layui.use(["table","form","upload","layer","tree","laydate","element"],function() {
    	var table = layui.table;
    	var form = layui.form;
    	var upload = layui.upload;
    	var layer = layui.layer;
    	var tree = layui.tree;
    	var laydate=layui.laydate;
    	var element=layui.element;

        form.on('submit(updateUser)', function(data){
            //发出ajax请求，往数据库里面存储数据---开始
            console.log(data);
            $.ajax({
                url:"http://localhost:8888/hy-admin/updateAdmin2",
                data:data.field,
                dataType:"json",
                type:"post",
                success:function(res){
                    if(res.code==0){
                        //关闭弹出层
                        layer.closeAll();
                        // x_admin_close();
                        layer.msg("修改成功！");
                        // window.location.replace("http://localhost:8888/index.jsp")
                    }else if(res.code==1){
                        layer.msg(res.message);
                    }else if(res.code==2){
                        layer.msg(res.message);
                    }
                }
            });
            //发出ajax请求，往数据库里面存储数据---结束
            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
        });

        upload.render({
            elem: '#uploadFile2' //绑定元素
            ,accept: "file"
            ,url: '${pageContext.request.contextPath}/hy-admin/uploadImage' //上传接口
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#preShow2').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                console.log(res)
                //上传完毕回调,需要把上传到服务器的文件名放到form表单里面。
                $("#ImageUpdate").val(res.msg);
            }
        });


    })
</script>

</body>
</html>